<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta content="telephone=no" name="format-detection">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <title>MglUI-表单组件</title>
    <meta name="keywords" content="不锈钢,钢铁,电商">
    <meta name="description" content="江苏东方不锈钢找货助手">

    <!-- MglUI core CSS -->
    <link href="./assets/css/mgui.css" rel="stylesheet" charset="utf-8">
    <link href="./assets/css/style.css" rel="stylesheet" charset="utf-8">
    <link href="./assets/lib/artdialog/ui-dialog.css" rel="stylesheet" charset="utf-8">

    <!-- HTML5shiv 和 Respond.js IE8支持HTML5 tooltipss和媒体查询 -->
    <!--[if lt IE 9]>
        <script src="./assets/js/html5shiv.js"></script>
        <script src="./assets/js/respond.min.js"></script>
    <![endif]-->
</head>

<body>
    <section id="container">
        <!--header start-->
        <header class="ui-header ui-header-positive clearfix">
            <div class="ui-col ui-col-20"><h2 class="logo" onclick="window.location.href='/'">CRM管理系统</h2></div>
            <div class="ui-col ui-col-60">
                <ul class="header-nav-sys">
                    <li class="active"><i class="ico-crm-sprite ico-crm-sys"></i>CRM</li>
                </ul>
            </div>
            <div class="ui-col ui-col-20">
                <ul class="top-menu pull-right">
                    <li>
                        <a class="menu-down" href="javascript:;"><i class="icon-people"></i>186******75</a>
                        <div class="dropdown-menu">
                            <a href="/">退出</a>
                            <a href="/">退出</a>
                        </div>
                    </li>
                </ul>
            </div>
        </header>
        <!--header end-->

                <!--sidebar start-->
        <div class="ui-sidebar ui-sidebar-positive" id="sidebar-menu">
            <div class="sidebar-toggle"><i class="icon-sanshuxian"></i></div>
            <!-- sidebar menu start-->
            <ul class="sidebar-menu">
                <li>
                    <a href="index.html">
                        <i class="icon-home1"></i>
                        <span>首页</span>
                    </a>
                </li>
                <li>
                    <a class="ui-arrowadd" href="javascript:;">
                        <i class="icon-photogallery"></i>
                        <span>UI元素</span>
                    </a>
                    <ul class="sub-menu">
                        <li><a href="general.html"><i class="icon-mac"></i><span>常规</span></a></li>
                        <li><a href="button.html"><i class="icon-sort"></i><span>按钮</span></a></li>
                        <li><a href="tabs.html"><i class="icon-keyboard"></i><span>Tab</span></a></li>
                        <li><a href="iconfont.html"><i class="icon-love"></i><span>字体图标</span></a></li>
                    </ul>
                </li>
                <li>
                    <a class="ui-arrowadd" href="javascript:;">
                        <i class="icon-iconxuexisel"></i>
                        <span>组件</span>
                    </a>
                    <ul class="sub-menu">
                        <li><a href="grids.html"><i class="icon-list1"></i><span>网格</span></a></li>
                        <li><a href="calendar.html"><i class="icon-carlendar"></i><span>日历</span></a></li>
                        <li><a href="charts.html"><i class="icon-booking"></i><span>图表</span></a></li>
                    </ul>
                </li>
                <li>
                    <a class="ui-arrowadd" href="javascript:;">
                        <i class="icon-bill"></i>
                        <span>表单</span>
                    </a>
                    <ul class="sub-menu">
                        <li><a href="form-component.html"><i class="icon-creditcard"></i><span>表单组件</span></a></li>
                        <li><a class="active" href="form-validator.html"><i class="icon-coupon"></i><span>表单验证</span></a></li>
                        <li><a href="form-wizard.html"><i class="icon-coupon"></i><span>表单向导</span></a></li>
                    </ul>
                </li>
                <li>
                    <a href="table.html">
                        <i class="icon-carlendar"></i>
                        <span>表格</span>
                    </a>
                </li>
                <li>
                    <a href="mail.html">
                        <i class="icon-mail1"></i>
                        <span>邮件</span>
                        <span class="ui-badge bg-important">2</span>
                    </a>
                </li>
                <li>
                    <a href="login.html">
                        <i class="icon-user"></i>
                        <span>登录页</span>
                    </a>
                </li>
            </ul>
            <!-- sidebar menu end-->
        </div>
        <!--sidebar end-->

        <section class="main-content">
            <section class="wrapper">
                <div class="ui-row">
                    <div class="ui-col ui-col-50 ui-pw15">
                        <div class="ui-panel">
                            <div class="ui-panel-header ui-border-b">验证状态样式</div>
                            <div class="ui-panel-body">
                                <form class="ui-form-horizontal">
                                    <div class="ui-form-group ui-has-success ui-mb32">
                                        <label class="ui-label-control ui-col ui-col-10">成功状态</label>
                                        <div class="ui-col-90">
                                            <input type="text" class="ui-input-control" placeholder="成功状态">
                                        </div>
                                    </div>
                                    <div class="ui-form-group ui-has-error ui-mb32">
                                        <label class="ui-label-control ui-col ui-col-10">错误状态</label>
                                        <div class="ui-col-90">
                                            <input type="text" class="ui-input-control" placeholder="错误状态">
                                        </div>
                                    </div>
                                    <div class="ui-form-group ui-has-warning">
                                        <label class="ui-label-control ui-col ui-col-10">警告状态</label>
                                        <div class="ui-col-90">
                                            <input type="text" class="ui-input-control" placeholder="警告状态">
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                    <div class="ui-col ui-col-50 ui-pw15">
                        <div class="ui-panel">
                            <div class="ui-panel-header ui-border-b">登录验证</div>
                            <div class="ui-panel-body">
                                <form id="loginForm" class="ui-form">
                                    <div class="ui-form-group">
                                        <label class="ui-mb4">账户</label>
                                        <input type="text" id="account" name="account" class="ui-input-control" placeholder="请输入账户">
                                    </div>
                                    <div class="ui-form-group">
                                        <label class="ui-mb4">密码</label>
                                        <input type="password" id="password" name="password" class="ui-input-control" placeholder="请输入密码">
                                    </div>

                                    <div class="ui-checkbox">
                                        <label>
                                            <input id="agree" name="agree" type="checkbox"><span>同意条款</span>
                                        </label>
                                    </div>
                                    <button type="submit" class="ui-btn ui-btn-info">登录</button>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
        </section>
    </section>



    <li class='sub-menu ui-arrowadd'><a href='javascript:;'><i class='null'></i><span>联系记录</span><li class='sub-menu ui-arrowadd'><a href='javascript:;'><i class='null'></i><span>联系记录</span><a href='javascript:;'><i class='null'></i><span>工具</span><li class='sub-menu ui-arrowadd'><a href='javascript:;'><i class='null'></i><span>联系记录</span><li class='sub-menu ui-arrowadd'><a href='javascript:;'><i class='null'></i><span>联系记录</span><a href='javascript:;'><i class='null'></i><span>工具</span></li>
</body>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="./assets/lib/artdialog/dialog.js"></script>
<script src="./assets/js/mgui.js"></script>

<!--表单验证插件-->
<script src="./assets/lib/validate/jquery.validate.min.js"></script>

<!--表单验证私有js-->
<script src="./assets/js/validate-script.js"></script>

</html>
